; (function (node) {
  var TodoList = function () {
    var _self = this;

    this.node = node;
    this.inputShow = false;
    this.isEdit = false;
    this.curIdx = null;
    this.dConfig = {
      "plusBtn": "",
      "inputArea": "",
      "addBtn": "",
      "list": "",
      "itemClass": ""
    };
    this.config = this.getConfig();
    this.itemClass = this.config.itemClass;

    for (var key in this.dConfig) {
      if (!this.config.hasOwnProperty(key)) {
        console.log(errorInfo(key));
        return;
      }
    }

    this.setConfig()

    addEvent(this.plusBtn, 'click', function () {
      _self.showInput.call(_self);
    })

    addEvent(this.addBtn, 'click', function () {
      _self.addBtnClick.call(_self);
    })

    addEvent(this.oList, 'click', function (e) {
      var event = e || window.event,
        tar = event.target || event.scrElement; // 事件源对象

      _self.listClick.call(_self, tar);
    })
  }

  TodoList.prototype = {
    getConfig: function () {
      return JSON.parse(this.node.getAttribute('data-config'));
    },
    setConfig: function () {
      var config = this.config,
        node = this.node;

      this.inputArea = node.getElementsByClassName(config.inputArea)[0];
      console.log(node, config.inputArea, this.inputArea)
      this.addBtn = this.inputArea.getElementsByClassName(config.addBtn)[0];
      this.plusBtn = node.getElementsByClassName(config.plusBtn)[0];
      this.oList = node.getElementsByClassName(config.list)[0];
      this.content = this.inputArea.getElementsByClassName('content')[0];

    },
    showInput: function () {
      var _self = this;

      if (this.inputShow) {
        setInputShow.call(_self, 'close');
      } else {
        setInputShow.call(_self, 'open');
      }
    },
    addBtnClick: function () {
      var _self = this,
        content = this.content.value,
        contentLen = content.length,
        oItems = this.oList.getElementsByClassName(this.itemClass),
        oItemsLen = oItems.length,
        itemText;

      if (contentLen <= 0) {
        return;
      }

      if (oItemsLen > 0) {
        for (var i = 0; i < oItemsLen; i++) {
          itemText = elemChildren(oItems[i])[0].innerText;

          if (itemText === content) {
            alert("已存在该项");
            return;
          }
        }
      }

      if (this.isEdit) {
        elemChildren(oItems[this.curIdx])[0].innerText = content;
        setInputStatus.apply(_self, [oItems, null, 'add'])
      } else {
        var oLi = document.createElement('li');
        oLi.className = this.itemClass;
        oLi.innerHTML = itemTpl(content);
        this.oList.appendChild(oLi);
      }

      setInputShow.call(_self, 'close');
    },
    listClick: function (tar) {
      var _self = this,
        className = tar.className,
        oParent = elemParent(tar, 2),
        oItems = this.oList.getElementsByClassName('item'),
        oItemsLen = oItems.length,
        item;

      if (className === 'edit-btn fa fa-edit') {

        for (i = 0; i < oItemsLen; i++) {
          item = oItems[i];

          item.className = 'item';
        }

        oParent.className += ' active';
        setInputShow.call(_self, 'open');
        setInputStatus.apply(_self, [oItems, oParent, 'edit']);
      } else if (className === 'remove-btn fa fa-times') {
        oParent.remove();
      }
    }
  };

  function setInputStatus(oItems, target, status) {
    if (status === 'edit') {
      var idx = Array.prototype.indexOf.call(oItems, target),
        itemText = elemChildren(target)[0].innerText;

      this.addBtn.innerText = '编辑第' + (idx + 1) + '项';
      this.isEdit = true;
      this.curIdx = idx;
      this.content.value = itemText;
    } else if (status === 'add') {
      var itemLen = oItems.length,
        item;

      for (var i = 0; i < itemLen; i++) {
        item = oItems[i]

        item.className = 'item';
      }
      this.addBtn.innerText = '增加项目'
      this.isEdit = false;
      this.curIdx = null;
    }
  }

  function itemTpl(text) {
    return (
      '<p class="item-content">' + text + '</p>' +
      '<div class="btn-group">' +
      '<a href="javascript:;" class="edit-btn fa fa-edit"></a>' +
      '<a href="javascript:;" class="remove-btn fa fa-times"></a>' +
      '</div>'
    )
  }

  function setInputShow(action) {
    var _self = this,
      oItems = this.oList.getElementsByClassName('item');
    if (action === 'open') {
      this.inputArea.style.display = 'block';
      this.inputShow = true;
    } else {
      this.content.value = '';
      this.inputArea.style.display = 'none';
      this.inputShow = false;
      setInputStatus.apply(_self, [oItems, null, 'add']);
    }
  }

  function errorInfo(key) {
    return new Error(
      '您没有配置参数' + key + '\n' +
      '必须配置的参数列表如下：\n' +
      '打开输入框按钮元素类名：plusBtn\n' +
      '输入框区域元素类名：inputArea\n' +
      '增加项目按钮元素类名：addBtn\n' +
      '列表承载元素类型：list\n' +
      '列表项承载元素类型: itemClass'
    );
  }



  new TodoList();
})(document.getElementsByClassName('todo-wrap')[0]);